<style type="text/css">
	/*初始化*/
	html{background: #f2f5f9;}
	body{color:#666666; font-size:14px; font-family:"微软雅黑"; background-color:#fff; height:100%; overflow-y:scroll;}
	.clearfix:after{content:"."; display:block; height:0; clear:both; overflow:hidden;}
	.clearfix{zoom:1;}
	/*日历*/
	.calendar-container{width:100%;margin: 10px 0px;}
	.calendar-title{width:100%; height:45px;color:#fff;background-color:#09F;margin-top: -10px;}
	.calendar-month{float:left;width:20%;height:45px;text-align:center;cursor:pointer;line-height:45px;}
	.calendar-year{float:left;width:20%;height:45px;text-align:center;cursor:pointer;line-height:45px;}
	.calendar-prevyear,
	.calendar-prevmonth,
	.calendar-nextyear,
	.calendar-nextmonth{float:left;width:15%; height:45px;text-align:center;cursor:pointer;line-height:45px;}
	.calendar-week{width:100%;height:45px;}
	.calendar-week div{float:left; width:14.28%; height:45px; color:#313131; background-color:#d7edff;text-align:center; line-height:45px; cursor:pointer;}
	.calendar-content{width:100%;background-color:#f2f5f9; }
	.calendar-content div{float:left; width:14.28%;line-height: 40px;padding: 5px 0px;background-color:#f2f5f9; color:#333; text-align:center; cursor:pointer;}
	.calendar-content .canChoose{background-color:#f2f5f9;}
	.canChoose-active{color: #fff !important;background-color:#09F !important;}
	.calendar-content div.notap{color: #ccc;}
	.calendar-content div.startDate{color: #5398d9 ;}
	.calendar-content div.endDate{color: #d84c29 ;}
	.Calendarhead{height: 1.4rem;background: #fff;padding-top: 0.2rem;}
	.calendarTips .span{width: 10px;height: 10px; border-radius: 50%;background: #D84C29;margin-right:3px;}
	.tipsdian{margin-left: 0.4rem;}
	.tipstext{margin-left: 0.4rem;color: #D84C29;}
	.button{margin-left: 6rem;margin-top: -0.6rem;width: 65px;background: #09F;color: #fff;border-radius: 3px;}
</style>
<div id="CalendarCont">
	<div class="Calendarhead">
		<div class="calendarTips flex flex-align-center">
			<div class="flex flex-align-center tipsdian">
				<psan class="span" style="background: #5398D9;"></psan>
				<p>账单日</p>
			</div>
			<div class="flex flex-align-center tipsdian">
				<psan class="span"></psan>
				<p>最后还款日</p>
			</div>
		</div>
		<div class="tipstext">请确保在最后还款日之前还完账单</div>
		<div class="button flex flex-align-center flex-pack-center">
			<p>完成</p>
		</div>
	</div>
	<div class="Calendarbox" id="Calendarbox"></div>
</div>
<script src="src/js/libs/calendar.js"></script>